import React from "react";
import {Row,Col} from "antd"
import './index.scss'
import {NavLink} from "react-router-dom";
interface listData {
    ListData:{title:string,path:string}[]
}
const HeadItem:React.FC<listData>=(prop)=>{
        return(
            <div style={{boxShadow:"0px 2px 10px 0px rgba(118,118,118,0.2)",backgroundColor:"white"}}>
              <Row>
                  <Col offset={6} style={{display:"flex"}}>
                      {
                          prop.ListData.map(item=>{
                              return <NavLink  key={item.title} className={({ isActive }) => isActive ? "headSecondItem activeHeadSecondItem" : "headSecondItem"} to={item.path} >{item.title}</NavLink>
                          })
                      }
                  </Col>
              </Row>
            </div>
        )
}
export  default  HeadItem
